<template>
	<view class="eduCard">
		<view class="flex alignCenter tip">
			<image src="https://image.alhelp.net/uploads/20231104/f5a50463b8dd7a1b1ea25f211c8ffd65.png" mode="widthFix"></image>
			<view class="font14 color999">看到对方的之前，需要您填写自己的教育信息喔！</view>
		</view>
		<view class="flex alignCenter card" v-for="(item,index) in eduList" :key="index">
			<image class="cardLogo" src="https://image.alhelp.net/uploads/20231104/d9894331de2de02d274ac350da92fd46.png" mode="widthFix"></image>
			<view class="cardInfo">
				<view class="hiddenTwoline bold font16">{{item.schoolName}}-{{item.majorName}}</view>
				<view class="font12 color666">{{item.graduationYear}}级-{{item.diploma==1?'本科':(item.diploma==2?'硕士研究生':'博士研究生')}}</view>
				<view class="flex alignCenter justConBetween">
					<view class="font12 colorBlue hiddenOneline">{{item.introduce}}</view>
					<view class="flex alignCenter operIcon">
						<image src="@/static/image/toolbox/edit.png" mode="widthFix" @click="cardClick('edit',item)"></image>
						<uni-icons type="trash" color="#d1d1d1" size="22" @click="cardClick('del',item)"></uni-icons>
					</view>
				</view>
			</view>
			<!-- 审核状态：0：未填写；1：已通过；2未通过-->
			<view class="noWidthBtn font12 cardStatus"v-if="item.auditState==0">待审核</view>
			<view class="noWidthBtn font12 cardStatus noPass" @click="statusClick(item)" v-if="item.auditState==2">未通过</view>
			<view class="cardStatus" v-if="item.auditState==1">
				<image src="https://image.alhelp.net/uploads/20231104/b4f43f4b40d1cb888bb46e2bcf76d409.png" mode="widthFix"></image>
			</view>
		</view>
		<uni-nodata v-if="eduList.length==0"></uni-nodata>
		<view class="fixedBottomBtn" @click="addClick"><text class="focusMargin">+</text>教育信息</view>
		<!-- 未通过原因 -->
		<view class="cardLayer flex alignCenter" v-if="showCardLayer">
			<view class="cardMain">
				<view class="">
					<view class="font16 bold colorMain bold">审核未通过！</view>
					<view class="font14 refuse">驳回理由：{{operData.auditReason}}</view>
					<view class="font14">如有疑问，请联系客服：</view>
					<image src="@/settingPages/pages/static/join.png" mode="widthFix"></image>
					<!-- <view class="normalBtnStyle">复制微信号</view> -->
				</view>
				<uni-icons type="close" color="#fff" size="30" @click="showCardLayer=false"></uni-icons>
			</view>
		</view>
	</view>
</template>

<script>
	import { educationList,delEducation } from "@/api/mine.js"
	export default {
		data() {
			return {
				showCardLayer:false,
				eduList:[],
				operData:''
			};
		},
		onShow() {
			this.getList()
		},
		methods:{
			// 未通过
			statusClick(item){
				this.operData=item
				this.showCardLayer=true
			},
			getList(){
				let param={
					page:1,
					size:10,
					createUserId:uni.getStorageSync('userId')
				}
				educationList(param).then((res)=>{
					if(res.code==100000){
						this.eduList=res.data.rows
					}
				})
			},
			cardClick(type,item){
				if(type=='edit'){
					uni.showModal({
						title: '提示',
						content: '编辑该信息后需要再走审核流程，是否确定前往编辑？',
						success: (res)=> {
							if (res.confirm) {
								uni.navigateTo({
									url:'/settingPages/pages/education/education?id='+item.id
								})
							}
						}
					});
				}else{
					uni.showModal({
						title: '提示',
						content: '删除该信息后，如若再添加需要再走审核流程，是否确定删除？',
						success: (res)=> {
							if (res.confirm) {
								delEducation({id:item.id}).then((res)=>{
									if(res.code==100000){
										this.getList()
									}
								})
							}
						}
					});
				}
			},
			addClick(){
				uni.navigateTo({
					url:'/settingPages/pages/education/education?from=add'
				})
			},
		}
	}
</script>
<style lang="scss">
page{
	background-color:$pageBgColor;
}
</style>
<style lang="scss" scoped>
.eduCard{
	padding: 30rpx 30rpx 120rpx;
	box-sizing: border-box;
}
.tip{
	padding: 30rpx 80rpx;
	box-sizing: border-box;
	margin:0 0 60rpx 0;
	image{
		width:92rpx;
		height:92rpx;
		margin:0 20rpx 0 0;
	}
}
.card{
	background:#fff;
	border-radius: 20rpx;
	padding: 30rpx;
	box-sizing: border-box;
	position: relative;
	box-shadow: 0 0 10rpx rgba(0, 0, 0, .2);
	margin: 0 0 30rpx;
	.cardLogo{
		width:100rpx;
		height: 100rpx;
		flex-shrink: 0;
		margin:0 20rpx 0 0;
	}
	.cardInfo{
		flex:1;
		.hiddenTwoline{
			margin:0 0 20rpx;
		}
	}
	.operIcon{
		image{
			width:48rpx;
			height: 48rpx;
			margin-right: 30rpx;
		}
	}
	.noWidthBtn{
		position: absolute;
		right:20rpx;
		top:20rpx;
		background:#f2f2f2;
	}
	.noPass{
		color: $colorred;
	}
	.cardStatus{
		position: absolute;
		right:20rpx;
		top:20rpx;
		image{
			width:130rpx;
			height: 130rpx;
		}
	}
}
.cardLayer{
	position:fixed;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.4);
	z-index:300;
	.cardMain{
		width:80%;
		margin: auto;
		text-align: center;
		&>view{
			text-align: center;
			background: #fff;
			border-radius: 20rpx;
			padding: 30rpx;
			box-sizing: border-box;
			margin:0 0 30rpx;
		}
		.refuse{
			margin: 40rpx 0;
		}
		image{
			width:40%;
			display: block;
			margin:20rpx auto 0;
		}
		.normalBtnStyle{
			box-shadow: none;
			margin:50rpx auto 0;
		}
	}
}
</style>
